<template>
  <div v-loading="loading" class="list-table">
    <div class="area-header">
      <span class="area-header-title">{{ $t('投资策略') }}</span>
    </div>
    <el-form ref="form" :model="form" :rules="rules" label-width="120px" class="dataForm">
      <el-row>
        <!-- 医疗健康 -->
        <el-col :span="24">
          <el-form-item :label="$t('投资阶段')" prop="investStage">
            <el-checkbox-group v-model="form.investStage">
              <el-checkbox
                v-for="(dict, index) in investStageOptions"
                :key="index"
                :label="dict.dictValue"
              >{{ $t(dict.dictLabel) }}</el-checkbox>
            </el-checkbox-group>
          </el-form-item>
        </el-col>
        <el-col :span="24">
          <el-form-item :label="$t('投资行业')" prop="investIndustry">
            <el-checkbox-group v-model="form.investIndustry">
              <el-checkbox
                v-for="(dict, index) in investIndustryOptions"
                :key="index"
                :label="dict.dictValue"
              >{{ $t(dict.dictLabel) }}</el-checkbox>
            </el-checkbox-group>
          </el-form-item>
        </el-col>
        <el-col :span="24">
          <el-form-item :label="$t('投资行业备注')" prop="investIndustryRemark">
            <el-input v-model="form.investIndustryRemark" type="textarea" :placeholder="$t('投资行业备注')" :autosize="{minRows: 3, maxRows: 20}" show-word-limit maxlength="1000" />
          </el-form-item>
        </el-col>
        <el-col :span="24">
          <el-form-item :label="$t('投资理念')" prop="investIdea">
            <el-input v-model="form.investIdea" type="textarea" :placeholder="$t('投资理念')" :autosize="{minRows: 3, maxRows: 20}" show-word-limit maxlength="1000" />
          </el-form-item>
        </el-col>
        <el-col :span="24">
          <el-form-item :label="$t('投资地域')" prop="investArea">
            <el-input v-model="form.investArea" type="textarea" :placeholder="$t('投资地域')" :autosize="{minRows: 3, maxRows: 20}" show-word-limit maxlength="1000" />
          </el-form-item>
        </el-col>
        <el-col :span="24">
          <el-form-item :label="$t('其它投资偏好')" prop="otherInvestPreference">
            <el-input v-model="form.otherInvestPreference" type="textarea" :placeholder="$t('其它投资偏好')" :autosize="{minRows: 3, maxRows: 20}" show-word-limit maxlength="1000" />
          </el-form-item>
        </el-col>
        <el-col :span="24">
          <el-form-item :label="$t('项目来源')" prop="itemSource">
            <el-input v-model="form.itemSource" type="textarea" :placeholder="$t('项目来源')" :autosize="{minRows: 3, maxRows: 20}" show-word-limit maxlength="1000" />
          </el-form-item>
        </el-col>
        <el-col :span="24">
          <el-form-item :label="$t('项目准入标准')" prop="itemStandard">
            <el-input v-model="form.itemStandard" type="textarea" :placeholder="$t('项目准入标准')" :autosize="{minRows: 3, maxRows: 20}" show-word-limit maxlength="1000" />
          </el-form-item>
        </el-col>
        <el-col :span="24">
          <el-form-item :label="$t('选择企业的策略依据')" prop="strategyBasis">
            <el-input v-model="form.strategyBasis" type="textarea" :placeholder="$t('选择企业的策略依据')" :autosize="{minRows: 3, maxRows: 20}" show-word-limit maxlength="1000" />
          </el-form-item>
        </el-col>
        <el-col :span="24">
          <el-form-item :label="$t('选择企业的量化方法')" prop="quantificationMethod">
            <el-input v-model="form.quantificationMethod" type="textarea" :placeholder="$t('选择企业的量化方法')" :autosize="{minRows: 3, maxRows: 20}" show-word-limit maxlength="1000" />
          </el-form-item>
        </el-col>
        <el-col :span="24">
          <el-form-item :label="$t('投资实际选择方式')" prop="actualSelect">
            <el-input v-model="form.actualSelect" type="textarea" :placeholder="$t('投资实际选择方式')" :autosize="{minRows: 3, maxRows: 20}" show-word-limit maxlength="1000" />
          </el-form-item>
        </el-col>
        <el-col :span="24">
          <el-form-item :label="$t('投资比例确定方法')" prop="determineMethod">
            <el-input v-model="form.determineMethod" type="textarea" :placeholder="$t('投资比例确定方法')" :autosize="{minRows: 3, maxRows: 20}" show-word-limit maxlength="1000" />
          </el-form-item>
        </el-col>
        <el-col :span="24">
          <el-form-item :label="$t('风险控制手段')" prop="riskControl">
            <el-input v-model="form.riskControl" type="textarea" :placeholder="$t('风险控制手段')" :autosize="{minRows: 3, maxRows: 20}" show-word-limit maxlength="1000" />
          </el-form-item>
        </el-col>
        <el-col :span="24">
          <el-form-item :label="$t('退出标准')" prop="exitStandard">
            <el-input v-model="form.exitStandard" type="textarea" :placeholder="$t('退出标准')" :autosize="{minRows: 3, maxRows: 20}" show-word-limit maxlength="1000" />
          </el-form-item>
        </el-col>
        <el-col :span="24">
          <el-form-item :label="$t('退出策略')" prop="exitStrategy">
            <el-input v-model="form.exitStrategy" type="textarea" :placeholder="$t('退出策略')" :autosize="{minRows: 3, maxRows: 20}" show-word-limit maxlength="1000" />
          </el-form-item>
        </el-col>
        <el-col :span="24">
          <el-form-item :label="$t('联合投资的合作机构')" prop="partners">
            <el-input v-model="form.partners" type="textarea" :placeholder="$t('联合投资的合作机构')" :autosize="{minRows: 3, maxRows: 20}" show-word-limit maxlength="1000" />
          </el-form-item>
        </el-col>
        <el-col :span="24">
          <el-form-item :label="$t('备注')" prop="remark">
            <el-input v-model="form.remark" type="textarea" :placeholder="$t('备注')" show-word-limit maxlength="2000" />
          </el-form-item>
        </el-col>
      </el-row>
    </el-form>
    <div v-show="!btnHide" slot="footer" class="dialog-footer" style="text-align: center;margin-top: 10px;">
      <!--保存，保存并启动流程，取消 三个按钮-->
      <SaveBtn has-permi="fund:strategy" :cancel-show="false" />
    </div>
  </div>
</template>

<script>
    import { saveFundInvestStrategy, getInvestStrategyByFundId } from '@/api/fund/strategy/fundInvestStrategy'
    export default {
        data() {
            return {
                // 投资阶段字典
                investStageOptions: [], // 投资行业字典
                investIndustryOptions: [], // 表单参数
                form: {
                  investStage: [],
                  investIndustry: []
                },
                // 遮罩层
                loading: false,
                // 表单校验
                rules: {
                investStage: [
                  { required: true, message: this.$t('必填信息'), trigger: 'blur' }
                ], investIndustry: [
                  { required: true, message: this.$t('必填信息'), trigger: 'blur' }
                ] },
                // 是否隐藏保存等按钮
                btnHide: false
            }
        },
        mounted() {
          this.$bus.$emit('async_done')
        },
        created() {
            this.getDicts('fund_investment_stage').then(response => {
                this.investStageOptions = response.data
            })
            this.getDicts('fund_investment_industry').then(response => {
                this.investIndustryOptions = response.data
            })
        },
        methods: {
            // 初始化数据
            init(data) {
                this.loading = true
                if (data != null) {
                    getInvestStrategyByFundId(data.id).then(response => {
                        if (response.data != null) {
                          this.form = response.data
                        } else {
                          this.reset()
                        }
                        this.loading = false
                    })
                } else {
                    this.reset()
                    this.loading = false
                }
            },
            // 表单重置
            reset() {
                this.form = {
                id: undefined,
                fundId: this.$route.query.id,
                investStage: [],
                investIndustry: [],
                investIndustryRemark: undefined,
                investIdea: undefined,
                investArea: undefined,
                otherInvestPreference: undefined,
                itemSource: undefined,
                itemStandard: undefined,
                strategyBasis: undefined,
                quantificationMethod: undefined,
                actualSelect: undefined,
                determineMethod: undefined,
                riskControl: undefined,
                exitStandard: undefined,
                exitStrategy: undefined,
                partners: undefined,
                remark: undefined,
                createBy: undefined,
                createTime: undefined,
                updateBy: undefined,
                updateTime: undefined,
                delFlag: undefined
                }
                this.resetForm('form')
            },
            // 取消按钮
            cancel() {
                this.$parent.$parent.formOpen = false
                this.$parent.$parent.reset()
            },
            // 关闭form页面
            closeForm() {
                // 关闭form页面遮罩层
                this.loading = false
                // 关闭form页面
                this.$parent.$parent.formOpen = false
                // 刷新list页面
                this.$parent.$parent.getList()
            },
            /** 提交按钮 */
            submitForm: function() {
                this.$refs['form'].validate(valid => {
                    if (valid) {
                        this.loading = true
                        saveFundInvestStrategy(this.form).then(response => {
                            if (response.code === 200) {
                                this.msgSuccess(this.$t('保存成功'))
                                this.closeForm()
                            } else {
                                this.msgError(response.msg)
                            }
                            this.loading = false
                        }).catch(() => {
                          this.loading = false
                        })
                    } else {
                      this.locationError(document)
                    }
                })
           }

        }

    }
</script>
